<!DOCTYPE html>
<html lang="zh-cn">
<head>
<title>Table</title>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
<link rel="stylesheet" href="css/basics.css">
<link rel="stylesheet" href="css/demo.css">
<link rel="stylesheet" href="css/table.css">
</head>
<body>
	<article class="demo-box">
		<h1>默认表格</h1>
		<hr>
		<table class="y-table">
			<colgroup>
				<col width="255">
				<col width="100">
				<col>
			</colgroup>
			<thead>
				<tr>
					<th>标题</th>
					<th>作者</th>
					<th>内容</th>
				</tr>
			</thead>
			<tbody>
				<tr>
					<td>《宣州谢朓楼饯别校书叔云》</td>
					<td>李白</td>
					<td>长风万里送秋雁，对此可以酣高楼。</td>
				</tr>
				<tr>
					<td>《青玉案·元夕》</td>
					<td>辛弃疾</td>
					<td>众里寻他千百度，蓦然回首，那人却在，灯火阑珊处。</td>
				</tr>
				<tr>
					<td>《无题》</td>
					<td>李商隐</td>
					<td>身无彩凤双飞翼，心有灵犀一点通。</td>
				</tr>
				<tr>
					<td>《出塞》</td>
					<td>王昌龄</td>
					<td>秦时明月汉时关，万里长征人未还。但使龙城飞将在，不教胡马度阴山。</td>
				</tr>
				<tr>
					<td>《离思》</td>
					<td>元稹</td>
					<td>曾经沧海难为水，除却巫山不是云。取次花丛懒回顾，半缘修道半缘君。</td>
				</tr>
			</tbody>
		</table>

	</article>

	<article class="demo-box">
		<h1>行边框表格</h1>
		<hr>
		<table class="y-table y-table-line-skin">
			<colgroup>
				<col width="255">
				<col width="100">
				<col>
			</colgroup>
			<thead>
				<tr>
					<th>标题</th>
					<th>作者</th>
					<th>内容</th>
				</tr>
			</thead>
			<tbody>
				<tr>
					<td>《夏日绝句》</td>
					<td>李清照</td>
					<td>至今思项羽，不肯过江东。</td>
				</tr>
				<tr>
					<td>《江雪》</td>
					<td>柳宗元</td>
					<td>孤舟蓑笠翁，独钓寒江雪。</td>
				</tr>
				<tr>
					<td>《春江晚景》</td>
					<td>苏轼</td>
					<td>竹外桃花三两枝，春江水暖鸭先知。</td>
				</tr>
				<tr>
					<td>《枫桥夜泊》</td>
					<td>王昌龄</td>
					<td>月落乌啼霜满天，江枫渔火对愁眠。 姑苏城外寒山寺，夜半钟声到客船。 </td>
				</tr>
				<tr>
					<td>《黄鹤楼送孟浩然之广陵》</td>
					<td>李白</td>
					<td>孤帆远影碧空尽，唯见长江天际流。</td>
				</tr>
			</tbody>
		</table>

	</article>

	<article class="demo-box">
		<h1>条纹表格</h1>
		<hr>
		<table class="y-table y-table-stripe-skin">
			<colgroup>
				<col width="255">
				<col width="100">
				<col>
			</colgroup>
			<thead>
				<tr>
					<th>标题</th>
					<th>作者</th>
					<th>内容</th>
				</tr>
			</thead>
			<tbody>
				<tr>
					<td>《凉州词》</td>
					<td>王之涣</td>
					<td>黄河远上白云间，一片孤城万仞山。</td>
				</tr>
				<tr>
					<td>《玉楼春 尊前拟把归期说》</td>
					<td>欧阳修</td>
					<td>人生自是有情痴，此恨不关风和月。</td>
				</tr>
				<tr>
					<td>《蝶恋花 榄剪愁烟兰泣露》</td>
					<td>晏殊</td>
					<td>昨夜西风凋碧树，独上高楼，望尽天涯路。</td>
				</tr>
				<tr>
					<td>《剑客》</td>
					<td>贾岛</td>
					<td>十年磨一剑，霜刃未曾试。</td>
				</tr>
				<tr>
					<td>《相见欢 无言独上西楼》</td>
					<td>李煜</td>
					<td>剪不断、理还乱，是离愁。别是一番滋味在心头。</td>
				</tr>
			</tbody>
		</table>

	</article>

	<article class="demo-box">
		<h1>分页样式</h1>
		<hr>
		<ul class="y-page">
			<li><a>上一页</a></li>
			<li><a class="active">1</a></li>
			<li><a>2</a></li>
			<li><a>3</a></li>
			<li><a>4</a></li>
			<li><a>5</a></li>
			<li><span>第 1 页，共 5页</span></li>
			<li><a>下一页</a></li>
		</ul>
	</article>

</body>
</html>